import React, { Component } from 'react';
import '../font_3849459_uns4zow32zm/iconfont.css'
import '../styles/Bottom.css'
class Bottom extends Component {
    state = {
        list: [
            { name: 'icon-dianpu', text: '店铺' },
            { name: 'icon-fenlei', text: '分类' },
            { name: 'icon-31quanbushangpin', text: '全部商品' },
            { name: 'icon-gouwuche', text: '购物车' },
            { name: 'icon-gerenzhongxin', text: '个人中心' },
        ],
        cuurnetindex: 1
    }
    handlerclick(index) {
        this.setState({ cuurnetindex:index })
    }
    render() {
        return (
            <div className='Bottom'>
                {
                    this.state.list.map((item, index) => {
                        return (
                            <div className={"item " + (this.state.cuurnetindex == index ? 'active' : '')} key={index} onClick={() => { this.handlerclick(index) }}>
                                <span className={'iconfont' + ' ' + item.name}></span>
                                <span>{item.text}</span>
                            </div>
                        )
                    })
                }

            </div>
        );
    }
}

export default Bottom;